{include file="index/_meta" /}
    <title>商品管理</title>
<style>
    .van-card__title{
        font-weight: bold;
        font-size: 16px;
    }
    .van-card__desc{
        color: red;
    }
    .van-card__price{
        color: red;
        font-size: 14px;
    }
</style>
</head>
<body>
<div id="app">
    <van-nav-bar
            title="商品管理"
            left-text="我的"
            left-arrow
            @click-left="jumpUser"
    ></van-nav-bar>
    <van-pull-refresh v-model="isLoading" @refresh="onRefresh">


        <van-search v-model="keywords" placeholder="请输入搜索关键词" input-align="center" shape="round" show-action @clear="onSearch">
            <template #action>
                <div @click="onSearch">搜索</div>
            </template>
        </van-search>

        <van-list
                v-model="loading"
                :finished="finished"
                finished-text="没有更多了"
                :immediate-check="no"
                @load="onLoad"
        >
            <div v-for="(item,index) in goodsList" :key="index" style="padding: 5px">
                <van-card
                        :price="item.price"
                        :desc="item.shop_name"
                        :title="item.name"
                        offset="70"
                        :thumb="item.img_thumb"
                        @click="jumpGoodsQiangDetail(item.id)"
                >
                    <template #desc>
                        <p style="margin: 0">
                            <span>总计售出：{{item.sale_num}}</span>
                        </p>
                    </template>
                    <template #price>
                        <b>抢购价：{{item.price}}</b>
                    </template>
                    <template #tags>
                        抢购时间：{{item.start_time}} {{item.end_time}}
                    </template>
                    <template #origin-price>
                        原价：{{item.original_price}}
                    </template>
                    <template #footer>
                        <van-button type="danger" size="mini" v-if="item.put_on == 10" @click.stop="handle(item.id,item.put_on,index)">下架</van-button>
                        <van-button type="primary" size="mini" v-else @click.stop="handle(item.id,item.put_on,index)">上架</van-button>
                    </template>

                </van-card>
            </div>
        </van-list>

    </van-pull-refresh>
    {include file="store/_tabbar" /}
</div>
<script>
    new Vue({
        el: "#app",
        data(){return{
            active:1,
            keywords: '',
            carouselList: [],
            // 下拉刷新
            isLoading: false,
            // 上拉加载
            loading: false,
            finished: false,
            goodsList: [],
            page: 0,
            last_page: 1,
            limit: 10,
            yes:true,
            no:false,
            choose:[],
        }},
        created(){
            this.onRefresh()
        },
        methods:{
            onTabbarChange(index){
                let url = '';
                switch (index) {
                    case 0:url = "{:url('store/index')}";break;
                    case 1:url = "{:url('store/goods_index')}";break;
                    case 2:url = "{:url('store/order_index')}";break;
                    case 3:url = "{:url('store/info_index')}";break;
                }
                window.location.href = url;
            },
            jumpUser(){
                window.location.href = "{:url('user/index')}"
            },
            // 上拉刷新
            onRefresh() {
                this.page = 1
                this.getQiang()
            },
            // 获取抢购商品列表
            getQiang() {
                let that = this;
                let latitude = localStorage.getItem('latitude')
                let longitude = localStorage.getItem('longitude')
                axios.post("{:url('goods/getGoodsListByShop')}",{
                    limit:that.limit,
                    page:that.page,
                    keywords:that.keywords,
                    shop_id:"{$Think.session.wechat.shop_id}"
                }).then(function (ret) {

                    if (that.page == 1){
                        that.goodsList = ret.data.data
                    }else{
                        for (var i = 0,len=ret.data.data.length;i<len;i++){
                            that.goodsList.push(ret.data.data[i])
                        }
                    }



                    that.last_page = ret.data.last_page
                    that.loading = false;
                    that.isLoading = false;
                })
            },
            // 下拉加载更多
            onLoad() {
                this.loading = true
                this.page ++
                if (this.last_page < this.page){
                    this.finished = true
                }else{
                    this.getQiang()
                }
            },
            // 跳转
            jumpGoodsQiangDetail(goods_id){
                window.location.href = "{:url('store/goods_detail')}?goods_id="+goods_id
            },
            onSearch(){
                this.page = 1
                this.getQiang()
            },
            handle(goods_id,put_on,index){
                let that = this
                let msg = '';
                if (put_on == 10){
                    put_on = 20
                    msg = '下架'
                }else{
                    put_on = 10
                    msg = '上架'
                }
                vant.Dialog.confirm({
                    title: '提示',
                    message: '确定要将商品'+msg,
                }).then(() => {
                    axios.post("{:url('goods/goods_edit_save')}",{id:goods_id,put_on:put_on}).then(function (res) {
                        let ret = res.data
                        if (ret.code == 0){
                            vant.Notify({ type: 'success', message: ret.msg,duration: 1000,onClose:function () {
                                    that.goodsList[index]['put_on'] = put_on
                                } });
                        }else{
                            vant.Notify({ type: 'danger', message: ret.msg,duration: 1000 });
                        }
                    })
                });

            }
        },
    })
</script>
</body>
</html>
